Never Ending Party

// 2023/06/04
// #minacoding 遊び
// #dailcodingseed push pop


const COLORS = [
  "#f94144",
  "#f3722c",
  "#f8961e",
  "#f9844a",
  "#f9c74f",
  "#90be6d",
  "#43aa8b",
  "#4d908e",
  "#577590",
  "#277da1",
];
const G = 9.8 * 0.01;
const SPEED_X = 10;
const SPEED_Y = 10;
const TAIL_LEN = 20;
const MAX = 100;

// --------------------
// Object
// --------------------

class MyObject {
  constructor(x, y, props) {
    this.pos = createVector(x, y);
    this.props = props;
    this.t = 0;

    this.speed = createVector(
      random(SPEED_X) - SPEED_X / 2,
      -random(SPEED_Y / 2, SPEED_Y)
    );
    this.oldPos = [];

    this.r = 0;
    this.n = Math.floor(random(3, 8));

    this.mode = Math.floor(random() * 100) < 1 ? "cat" : "star";
  }

  update() {
    this.t++;

    this.r += this.speed.x;
    this.speed.y += G;

    this.pos.add(this.speed);

    this.oldPos.push(this.pos.copy());
    if (this.oldPos.length == TAIL_LEN) {
      this.oldPos.shift();
    }
  }

  get dead() {
    // return this.t > 360
    return this.oldPos[0].y > height;
  }

  display() {
    // line
    push();
    {
      noFill();
      for (let i = 1; i < this.oldPos.length; i++) {
        stroke(
          lerpColor(color(255, 0), this.props.color, i / this.oldPos.length)
        );

        const start = this.oldPos[i - 1];
        const end = this.oldPos[i];
        line(start.x, start.y, end.x, end.y);
      }
    }
    pop();

    // shape
    push();
    {
      translate(this.pos.x, this.pos.y);
      if (this.mode == "star") {
        noStroke();
        fill(this.props.color);
        rotate(this.r * 0.1);

        // n star
        const n = this.n;
        const state = 2.5;

        const step = 360 / n;
        const r = this.props.size;

        beginShape();
        for (let d = 0 + 90; d < 361 + 90; d += step) {
          const rad = radians(d);
          const radIn = radians(d + step / 2);
          vertex(r * cos(rad), r * -sin(rad));
          vertex((r / state) * cos(radIn), (r / state) * -sin(radIn));
        }
        endShape();
      } else {
        rotate(this.r * 0.01);
        noSmooth();
        imageMode(CENTER);
        image(imgCat, 0, 0, this.props.size * 2, this.props.size * 2);
      }
    }
    pop();

    // info
    //         stroke(255)
    //     fill(this.props.color)
    //     textAlign(CENTER, TOP);

    //     text(`${Math.floor(this.pos.x)},${Math.floor(this.pos.y)}`, this.pos.x, this.pos.y + this.props.size)
  }
}

// --------------------
// main
// --------------------

let imgCat;
function preload() {
  imgCat = loadImage("neko.png");
}

let objs = [];
function setup() {
  createCanvas(windowWidth, windowHeight);
  noCursor();

  addObject();
  setInterval(addObject, 10);
}

function addObject(x, y) {
  if (objs.length > MAX) return;

  if (x == undefined) x = mouseX;
  if (y == undefined) y = mouseY;

  objs.push(
    new MyObject(x, y, {
      size: random(10, 20),
      color: color(random(COLORS)),
      // color: color(
      //   random(128, 255),
      //   random(128, 255),
      //   random(128, 255),
      //   random(128, 255)
      // ),
    })
  );
}

function draw() {
  background(255);

  // cone
  noStroke();
  fill(255, 255, 0);
  triangle(
    mouseX,
    mouseY + SPEED_Y * 10,
    mouseX - SPEED_X * 2,
    mouseY,
    mouseX + SPEED_X * 2,
    mouseY
  );
  fill(200, 200, 0);
  ellipse(mouseX, mouseY, SPEED_X * 4, SPEED_Y * 2);

  // stars
  for (const obj of objs) {
    obj.update();
  }

  for (const obj of objs) {
    obj.display();
  }

  objs = objs.filter((obj) => !obj.dead);
}